/* eslint-disable */
import * as Request from '@/api/liubike';
import { config } from "@/api/config"
import { Toast, Dialog } from "mand-mobile";
import store from "@/tools/factory"
import { TMap } from "../../tools/Tmap";
let that = null;
let loginInfo = null;

export default {
    components: {
        [Dialog.name]: Dialog
    },
    data() {
        return {
            lat: config.latLng.lat,
            lng: config.latLng.lng,
            Plat: config.latLng.lat,
            Plng: config.latLng.lng,
            zoom: 18,
            polygon: null,
            outFence: false,
            bno: "",
            map: null,
            carInfo: {},
            unlockStatus: false,
            getVehicleStatus: false,
            ridingText: "请在橙色运营区域内骑行，P点还车",
            returnText: "区域外无法还车",

        }
    },
    mounted() {
        that = this;
        this.unlockStatus = false
        this.initMap();
        this.carInfo = store.get("carInfo");
        if (!this.carInfo.inParkingSpot) {
            Dialog.alert({
                title: '当前位置不是停车点',
                content: `用车结束后，请将车辆骑至停车点后还车`,
                confirmText: '我知道了'
            })
        }
        if (store.get("powerConfig")) {
            this.ridingText = store.get("powerConfig").outFenceConfig.ridingText;
            this.returnText = store.get("powerConfig").outFenceConfig.returnText;
        }
    },
    methods: {
        back() {
            this.$router.back(-1)
        },
        drawFence() {
            let path = [];
            if (this.polygon) {
                this.polygon.setMap(null);
            }
            let list = store.get("routerInfo").polygonPonits;

            list.map(item => {
                path.push(new qq.maps.LatLng(item.lat, item.lng))
            })
            path.push(new qq.maps.LatLng(list[0].lat, list[0].lng))
            //初始化polygon
            this.polygon = new qq.maps.Polygon({
                //多边形的填充色，可通过Color对象的alpha属性设置透明度。
                fillColor: new qq.maps.Color.fromHex("#FF6E2A", 0.4),
                //fillColor: new qq.maps.Color(0, 0, 0, 0.5),
                //要显示多边形的地图。
                map: that.map,
                //多边形的路径，以经纬度坐标数组构成。
                path: path,
                //多边形的线条颜色，可通过Color对象的alpha属性设置透明度。
                strokeColor: '#ff6e2a',
                //多边形的边框样式。实线是solid，虚线是dash。
                strokeDashStyle: 'dash',
                //多边形的边框线宽。
                strokeWeight: 5,
                //多边形是否可见。
                visible: true,
                //多边形的zIndex值。
                zIndex: 1000
            });
            that.map.fitBounds(that.polygon.getBounds());
            setTimeout(function () {
                that.getVehicleStatus = true;
                Toast.hide()
            }, 1000)
        },
        setCenter() {
            Toast({
                content: '正在定位...',
                position: 'bottom'
            })
            that.drawFence();
        },
        unlockCar() {
            if (this.unlockStatus) {
                return false
            }
            this.unlockStatus = true;
            Toast.loading("开锁中...");
            Request.unlockCar({
                operatorNo: this.carInfo.operatorNo,
                source: 3,
                unlockCheck: false,
                unlockConfirm: false
            }).then(res => {
                that.unlockStatus = false
                Toast.hide();
                if (res.success) {
                    console.log("res", res.data)
                    store.set("progressConfig", res.data.progressConfig);
                    store.set("t1", res.data.t1);
                    that.$router.replace({
                        name: "unlocking"
                    })
                } else {
                    Dialog.alert({
                        title: '温馨提示',
                        content: res.msg,
                        confirmText: '确定',
                        onConfirm: function () {
                            that.unlockStatus = false
                        }
                    })
                }
            })
        },
        initMap() {
            //定义地图中心点坐标
            TMap().then(qq => {
                let center = new qq.maps.LatLng(config.latLng.lat, config.latLng.lng)
                that.map = new qq.maps.Map(document.getElementById("container"), {
                    // 地图的中心地理坐标。
                    center: center,
                    zoom: that.zoom,
                    mapTypeControl: false,
                    panControl: false,
                    zoomControl: false,
                    scaleControl: false,
                    draggable: false,               //设置是否可以拖拽
                    scrollwheel: false,             //设置是否可以滚动
                });
                that.drawFence()
            });
        },
    }
}
